<template>
  <!-- 生日业务员 -->
  <div style="min-height:350px">
    <Form :model="form" ref="form" :rules="rules" label-position="right" label-width="90">
      <Row gutter="10">
        <i-col span="6">
          <FormItem label="选择渠道">
            <Select v-model="form.branchType" clearable>
              <Option v-for="item in saleChannelList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="管理机构" prop="managecom">
            <Select v-model="form.managecom" clearable>
              <Option v-for="item in organizationList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="销售机构">
            <Select v-model="form.agentgroup" @on-change="val=>getBranchmanager(val,{fileByte:'groupDistrict'})"
              clearable>
              <Option v-for="item in agentgroupList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <!-- bran -->
          <FormItem label="区部组">
            <Select v-model="form.groupDistrict" clearable>
              <Option v-for="item in groupDistrictList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
      </Row>
      <Row gutter="10">
        <i-col span="6">
          <FormItem label="员工姓名">
            <Input v-model="form.name" clearable placeholder="请输入" />
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="员工工号">
            <Input v-model="form.agentcode" clearable placeholder="请输入" />
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="生日日期" prop="birthday">
            <DatePicker :value="form.birthday" @on-change="val=>$set(form,'birthday',val)" format="yyyy-MM-dd"
              type="date" placeholder="请选择" />
          </FormItem>
        </i-col>
        <i-col span="6" style="display: flex;justify-content: flex-end;">
          <Button type="primary" @click="loadResources" :loading="isLoading" icon="md-search"
            style="margin-right:20px;">查询</Button>
          <Button @click="resetForm(),getDay()" icon="md-refresh">重置</Button>
          <!-- <Button @click="toDetail()" icon="md-refresh">重置</Button> -->
        </i-col>
      </Row>
    </Form>

    <Table :columns="columns" :data="tableData" :loading="isLoading" ref="selection" style="margin-top:10px">
      <template slot-scope="{ row }" slot="birthday">
        <span v-if="row.birthday">{{row.birthday.slice(0,10)}}</span>
      </template>
      <template slot-scope="{ row }" slot="operate">
        <span class="table-button" @click="toDetail(row)">查看详情</span>
      </template>
    </Table>

    <Page :total="ipagination.total" show-sizer show-total style="text-align:right;margin-top:20px"
      @on-change="handleCurrentChange" @on-page-size-change="handleSizeChange"
      :page-size-opts="ipagination.pageSizeOptions" :current="ipagination.pageIndex" :page-size="ipagination.pageSize"
      transfer></Page>
  </div>
</template>

<script>
import { getSelectListMixin } from "../../util/mixins/getSelectListMixin";
import { loadResourcesMixin } from "../../util/mixins/loadResourcesMixin";
import { tableChangeMixin } from "../../util/mixins/tableChangeMixin";
export default {
  name: "birthdaySalesman",
  mixins: [loadResourcesMixin, tableChangeMixin, getSelectListMixin],
  data() {
    return {
      mixinData: {
        tableAxios: "selectAgentBirthday",
        disableMixinCreated: true,
      },
      columns: [
        {
          title: "序号",
          type: "index",
          align: "center",
        },
        {
          title: "业务员姓名",
          key: "name",
          align: "center",
        },
        {
          title: "业务员工号",
          key: "agentcode",
          align: "center",
        },
        {
          title: "生日日期",
          slot: "birthday",
          align: "center",
        },
        {
          title: "相关保单",
          slot: "operate",
          align: "center",
          width: "130",
          fixed: "right",
        },
      ],
      rules: {
        managecom: [
          {
            required: true,
            message: "请选择管理机构",
            trigger: "change",
          },
        ],
        birthday: [
          {
            required: true,
            message: "请选择生日日期",
            trigger: "change",
          },
        ],
      },
    };
  },
  mounted() {
    let birthday = JSON.parse(localStorage.getItem("birthday"));
    let birthdayPage = JSON.parse(localStorage.getItem("birthdayPage"));
    if (birthday) {
      this.$set(this, "form", birthday);
      this.$set(this, "ipagination", birthdayPage);
      this.$nextTick(() => this.loadResources());
      localStorage.removeItem("birthday");
      localStorage.removeItem("birthdayPage");
    } else this.getDay();
  },
  methods: {
    toDetail(row) {
      let userInfo = JSON.parse(localStorage.getItem("userInfo"));
      localStorage.setItem("birthday", JSON.stringify(this.form));
      localStorage.setItem("birthdayPage", JSON.stringify(this.ipagination));

      this.$router.push({
        name: "birthdayW",
        query: {
          tabIndex: userInfo.roleId == 21 ? "1" : "未失效",
          agentcodename: row.name,
          agentcode: row.agentcode,
        },
      });

      return;

      if (userInfo.roleId == 21) {
        // 专员
        // 跳转到工作池，并带着该业务人员姓名以及服务状态为未服务或服务中的督导件，收费件和失效件以及切换终止件的时候只需要查询该业务员的姓名
        this.$router.push({
          name: "workPool",
          query: { tabIndex: "1", agentcodename: row.name },
          // query: { tabIndex: "1", agentcodename: "1231321" },
        });
      } else {
        // 主管和内勤
        // 跳转到工作状况统计，并带着业务员姓名以及服务状态是未服务/服务中筛选未失效，切换已失效以及切换终止件带着业务员姓名查询
        this.$router.push({
          name: "workConditionSum",
          query: { tab: "未失效", agentname: row.name },
          // query: { tabIndex: "未失效", agentname: "1231321" },
        });
      }
    },
    getDay() {
      let date = new Date(),
        year = date.getFullYear(),
        month = date.getMonth() + 1,
        day = date.getDate();
      this.$set(
        this.form,
        "birthday",
        `${year}-${month > 9 ? month : "0" + month}-${
          day > 9 ? day : "0" + day
        }`
      );
    },
    checkMust() {
      // console.log(this.form);
      let flag;
      this.$refs.form.validate((valid) => (flag = valid));
      return flag;
    },
  },
};
</script>

<style>
</style>